<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <script>
        function myFunction() {
            alert("你好，我是一个警告框！");
        }
    </script>
</head>

<body>

    <input type="button" onclick="myFunction()" value="显示警告框" />

    <!-- 确认框 -->
    <p>点击按钮，显示确认框。</p>
    <button onclick="myFunction2()">点我</button>
    <p id="demo"></p>
    <script>
        function myFunction2() {
            var x;
            var r = window.confirm("按下按钮!");
            if (r == true) {
                x = "你按下了\"确定\"按钮!";
            }
            else {
                x = "你按下了\"取消\"按钮!";
            }
            document.getElementById("demo").innerHTML = x;
        }
    </script>

    <!-- 提示框 -->
    <!-- 当提示框出现后，用户需要输入某个值，然后点击确认或取消按钮才能继续操纵。
        如果用户点击确认，那么返回值为输入的值。如果用户点击取消，那么返回值为 nul -->
    <p>点击按钮查看输入的对话框。</p>
    <button onclick="myFunction3()">点我</button>
    <p id="demo2"></p>
    <script>
        function myFunction3() {
            var x;
            var person = prompt("请输入你的名字", "Harry Potter");
            if (person != null && person != "") {
                x = "你好 " + person + "! 今天感觉如何?";
                document.getElementById("demo2").innerHTML = x;
            }
        }
    </script>
</body>

</html>